<!DOCTYPE html>
<html lang="zh-cn">
	<head>
	    <meta charset="utf-8">
	   	<title>HTML TEMP </title>
	   	<script type="text/javascript">
	   	function setImg(imgId){
	   	 	var  imgContainer=document.getElementById('imgContainer');
	   	 	 imgContainer.src=imgId+".jpg";
	    }
	    var curIndex=1;
	    var doWork=function(){
	    	var nextIndex=(++curIndex)%4;
	    	if(nextIndex==0){
	    		nextIndex++;
	    		curIndex++;
	    	}
	    	console.log(nextIndex);
	    	setImg(nextIndex);
	    };
	    setInterval(doWork,1000);
	   	</script>
	   
	</head>
	<body>
		<img id="imgContainer" width="300px" src="1.jpg">
		<br>
		<a href="javascript:void(0);" onclick="setImg(1)">1</a>
		<a href="javascript:void(0);" onclick="setImg(2)">2</a>
		<a href="javascript:void(0);" onclick="setImg(3)">3</a>

	</body>
</html>